import React from "react";

const Email = () => {
    const [business,setBusiness] = React.useState(React.Cookies.load('business') ? React.Cookies.load('business') : {});
    const [code,setCode] = React.useState('');
    // 初始化一个路由方法
    let navigate = React.Router.useNavigate();

    const [form] = React.Vant.Form.useForm();

    const noSend = async () =>{
        // console.log(11111);

        // 组装数据
        let data = {
            busid:business.id,
            email:business.email
        }
        console.log(1111);
        let result = await React.Api.emailSend(data);
    }

    const onCheck = async () =>{
        // console.log(11111);

        // 组装数据
        let data = {
            busid:business.id,
            email:business.email,
            code:code
        }
        console.log(1111);
        let result = await React.Api.emailCheck(data);
    }

    const onChangeInput = (e) => {
        // let name = e.target.name;
        let value = e.target.value;
        setCode(value);
    }

    const FormFooter = () => {
        return (
            <div style={{ margin: '16px 16px 0' }}>
                <React.Vant.Button round nativeType='submit' type='primary' block>
                    确认
                </React.Vant.Button>
            </div>
        )
    }
    const onSubmit = () => {
        console.log(1111);
    }

    return (
        <>
            <React.Vant.Sticky
                zIndex={10}
            >
                <React.Vant.NavBar
                    title="基本资料"
                    leftText="返回"
                    onClickLeft={() => navigate(-1)}
                />
            </React.Vant.Sticky>

            <div className="my_kuang">
                <div className="bj_img">
                    <img className="beij_s" src="/assets/images/my_beij.jpg" alt="" />
                    <div className="nimetou_gaib">
                        <div className="toux_hou">
                            <img id="Dfgrg" style={{height:"1.1rem"}} src={business.avatar_cdn} alt="" />
                            
                        </div>
                    </div>
                </div>

                <div className="profile" style={{paddingBottom:'20px'}}>
                    <React.Vant.Form
                        form={form}
                        onFinish={onSubmit}
                        footer={<FormFooter />}
                        labelAlign='right'
                        colon
                    >
                        {/* 手机号 */}
                        <React.Vant.Form.Item
                            name='email'
                            label='邮箱号'
                            labelWidth='55'
                            initialValue={business.email}
                        >
                            <React.Vant.Input placeholder='请输入邮箱号' readOnly />
                        </React.Vant.Form.Item>

                        <React.Vant.Form.Item
                            name='code'
                            label='验证码'
                            labelWidth='55'
                            initialValue={''}
                        >
                            <React.Vant.Input placeholder='请输入验证码' />
                        </React.Vant.Form.Item>
                    </React.Vant.Form>
                </div>
            </div>

            <h2>邮箱认证：{business.email}</h2>
            <button onClick={noSend}>发送验证码</button>
            <input type="text" value={code} placeholder="请输入验证码" onChange={(e) => onChangeInput(e)}></input>
            <button onClick={onCheck}>提交</button>
        </>
    )
}

export default Email;